<template>
  <Dialog title="调整项目价格" v-model="dialogVisible" width="50%" :close-on-click-modal="false">
    <el-table :data="tableData" style="width: 100%">
      <el-table-column label="项目" align="center" prop="project" />

      <el-table-column
        v-for="column in columnList"
        :key="column.prop"
        :prop="column.prop"
        :label="column.label"
        align="center"
      >
        <template #default="scope">
          <el-input
            @blur="blurInput(scope.row.id, scope.row[scope.row.key])"
            :min="1"
            v-model="scope.row[scope.row.key]"
          />
        </template>
      </el-table-column>
    </el-table>
  </Dialog>
</template>
<script setup lang="ts">
import * as StoreEmployeeApi from '@/api/meijia/store/employee'
import { DICT_TYPE, getIntDictOptions, getStrDictOptions } from '@/utils/dict'
import { da } from 'element-plus/es/locale'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗

const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formData = ref({
  id: undefined,
  code: undefined,
  agentCode: undefined,
  name: undefined,
  workBusinessTime: undefined,
  weekendBusinessTime: undefined,
  longitude: undefined,
  latitude: undefined,
  address: undefined,
  status: undefined
})
const tableData = ref()
const columnList = ref()
const blurInput = async (id: number, price: number) => {
  const param: StoreEmployeeApi.StoreEmployeeProjectVO = {
    id: id,
    originalPrice: price * 100
  }
  await StoreEmployeeApi.updateStoreEmployeeProjectPrice(param)
  message.success(t('common.updateSuccess'))
}

const formRef = ref() // 表单 Ref
const storeOwnerList = ref()

/** 打开弹窗 */
const open = async (employeeCode: string) => {
  dialogVisible.value = true
  const data = await StoreEmployeeApi.getEditProject(employeeCode)
  columnList.value = data.employeeProjectColumnList
  tableData.value = data.employeeProjectValueList
}
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
</script>
<style scoped>
.el-select {
  width: 100%;
}
#map-box {
  height: 300px;
  width: 100%;
  padding: 0px;
  margin: 0px;
}
.info-box {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 300px;
  background-color: #1f1f1f;
  display: flex;
  flex-direction: column;
}
</style>
